<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		html{
			font-size: 62.5%;
		}
		.body{
			font-size: 62.5%;
		}
		.container{
			font-size: 1rem;
		}
		

		.div1{
			font-size: 2em;
		}

		.div2{
			font-size: 1rem;
		}


		
	</style>
</head>
<body class="body">
<div class="container">
	<pre>
	任意浏览器的默认字体高都是16px。
	所有未经调整的浏览器都符合: 1em=16px。
	那么12px=0.75em,10px=0.625em。
	为了简化font-size的换算，需要在css中的body选择器中声明Font-size=62.5%，
	这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。</pre>
	<div  class="div">
		<div class="div1">font-size: 2em;<br>  
			em会继承父级元素的字体大小:計算后的字體大小為：15px<br>

		 </div>
		 <br><br><br>
		<div class="div2">
		font-size: 1rem;
		rem是全部的长度都相对于根元素，根元素是谁？html元素。通常做法是给html元素设置一个字体大小，然后其他元素的长度单位就为rem。
		</div>
	</div>
</div>

</body>
</html>